/** 
 
*/
import React, { PureComponent } from 'react';
import { SecondHeaderC, SelectC } from '@/src/comps';
import { CaretDownOutlined } from '@ant-design/icons';
import styles from './styles.less';

class SPPITestItem extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      open: false,
    };
  }

  componentDidMount() {}

  onChange = (value, options = {}) => {
    const { form } = this.props;

    value && options.onChange && options.onChange(value, form);
    setTimeout(() => {
      const { a, b, c, d, e, f } = form.getFieldsValue();
      if (a && b && c && d && e && f) {
        if (a == '2' && b == '2' && c == '2' && d == '2' && e == '2' && f == '2') {
          form.setFieldsValue({ xtpd: '1', rgpd: '1' });
        }
        if ([a, b, c, d, e, f].indexOf('1') > -1) {
          form.setFieldsValue({ xtpd: '2', rgpd: '2' });
        }
      }
    }, 500);
  };

  onItemChange = (e, x = {}) => {
    const { options, form } = this.props;
    x.onChange && x.onChange(e, form);
    setTimeout(() => {
      form.setFieldsValue({ [options.key]: options.initialValue(form, e) });
      this.onChange(null, options);
    }, 500);
  };

  render() {
    const { open } = this.state;
    const { options, form } = this.props;

    return (
      <div>
        <div style={{ display: 'flex' }}>
          <div style={{ flex: '1' }} onClick={() => this.setState({ open: !open })}>
            <SecondHeaderC
              title={options.title}
              Left={<CaretDownOutlined className={styles.downicon} style={{ marginLeft: '10px', ...(open ? null : { transform: 'rotate(-90deg)' }) }} />}
            />
          </div>

          <div style={{ display: 'flex' }}>
            <div style={{ lineHeight: '38px' }}>{'是否影响通过sppi测试'}:</div>
            <div style={{ marginLeft: '20px' }}>
              <SelectC form={form} dataIndex={options.key} selectWidth={200} onChange={(e) => this.onChange(e, options)} dataSource={options.dataSource} />
            </div>
          </div>
        </div>
        <div style={{ display: open ? 'block' : 'none' }}>
          {options?.children?.map((x) => {
            return (
              <div key={x.key} style={{ display: 'flex', justifyContent: 'flex-end' }}>
                <div style={{ display: 'flex', textAlign: 'right', alignItems: 'center', height: '38px' }}>{x.title}:</div>
                <div style={{ marginLeft: '20px' }}>
                  <SelectC
                    form={form}
                    onChange={(e) => this.onItemChange(e, x)}
                    dataIndex={x.key}
                    selectWidth={200}
                    dataSource={x.dataSource}
                    disabled={x.disabled && x.disabled(form)}
                  />
                </div>
              </div>
            );
          })}
        </div>
      </div>
    );
  }
}
export default SPPITestItem;
